<template>
  <div class="container">
    <el-upload
      class="upload-demo"
      drag
      action="http://8.140.56.19:8989/group-wxapp/gs/v1"
      :headers="headerObj"
      :before-upload="beforeUpload"
      :on-success="handleSuccess"
      :limit="1"
      :on-exceed="handleExceed"
      multiple
    >
      <i class="el-icon-upload" />
      <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
      <div slot="tip" class="el-upload__tip">只能上传xlsx/xls文件，且不超过2MB</div>
    </el-upload>
  </div>
</template>

<script>
import { getToken } from '@/utils/auth'
export default {
  components: { },
  data() {
    return {
      headerObj: {
        Authorization: 'Bearer ' + getToken(),
        Channel: 'PC'
      }
    }
  },
  methods: {
    beforeUpload(file) {
      const isExcel = /\.(xlsx|xls)$/.test(file.name)
      const isLt2M = file.size / 1024 / 1024 < 2
      console.log(file.type)
      if (!isExcel) {
        this.$message.error('上传内容只能是 excel 文件!')
      }
      if (!isLt2M) {
        this.$message.error('上传文件大小不能超过 2MB!')
      }
      return isExcel && isLt2M
    },
    handleSuccess(res, file) {
      if (res.code === 9999) {
        this.$message.success('上传成功')
      }
    },
    handleExceed(files, fileList) {
      this.$message.warning(`当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`)
    }
  }
}
</script>
<style>
  .container{
    text-align: center;
    margin-top: 10%;
  }
</style>
